{% extends "saltstack/index.html" %}

{% block right_content %}
<div id="right_menu">
    <table id="example" style="table-layout:fixed;" class="table table-bordered table-hover">
        <thead >
        <td class="col">用户名</td>
        <td class="col">主机</td>
        <td class="col">类型</td>
        <td class="col">命令</td>
        <td class="col">操作</td>
        </thead>
        {% if logs %}
        {% for log in logs %}
        <tr>
            <td class="col">{{ log.username }}</td>
            <td class="col">{{ log.minions }}</td>
            <td class="col">{{ log.stalt_type }}</td>
            <td class="col">{{ log.stalt_input }}</td>
            <td class="col">
                <a data-id="{{ log.id }}" class="hint hint-top mouse_pointer" data-hint="详情" data-toggle="modal" data-target="#lookItem"><span class="glyphicon glyphicon-eye-open"></span></a>
            </td>
        </tr>
        {% endfor %}
        {% endif %}
    </table>

    <div class="bottom_menu">
        <span>跳转到
         <select class="pagei">
             {% for temppage in page_list %}
             <option value="{{ temppage }}" {% ifequal temppage page %}selected {% endifequal %}>{{ temppage }}</option>
             {% endfor %}
         </select>页
        </span>
        <span style="padding-left: 28%;">每页{{ page_num }}条，第{{ page }}页，共{{ count }}条，共{{ page_total }}页</span>
        <span style="float:right;padding-right:50px">
            <a class="word hint hint-top" data-hint="首页" href="{% url 'saltstack:logs' %}?page=1"><span class="glyphicon glyphicon-fast-backward"></span></a>
            {% ifnotequal page 1 %}&nbsp;
            <a href="{% url 'saltstack:logs' %}?page={{ page|add:-1 }}" class="hint hint-top" data-hint="上一页"><span class="glyphicon glyphicon-step-backward"></span></a>
            {% endifnotequal %}
            {% ifnotequal page page_total %}&nbsp;
            <a href="{% url  'saltstack:logs' %}?page={{ page|add:1 }}" class="hint hint-top" data-hint="下一页"><span class="glyphicon glyphicon-step-forward"></span></a>
            {% endifnotequal %}
            <a class="word hint hint-top" data-hint="尾页" href="{% url 'saltstack:logs' %}?page={{ page_total }}"><span class="glyphicon glyphicon-fast-forward"></span></a>
        </span>
    </div>
</div>


<!-- 模态框（Modal）编辑用户资料 -->
<div class="modal fade" id="lookItem" tabindex="-1" role="dialog" aria-labelledby="lookItemLabel">
    <div class="modal-dialog">
        <div class="modal-content" style="width:800px">
            <div class="modal-header">
                <button type="button" class="close"
                        data-dismiss="modal">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    详情
                </h4>
            </div>
            <div class="modal-body item_details">
                <table class="table table-bordered table-hover">
                    <thead>
                        <td class="col1">用户名</td>
                        <td class="col2">主机</td>
                        <td class="col3">类型</td>
                        <td class="col4">命令</td>
                        <td class="col5">jobs</td>
                        <td class="col6">时间</td>
                    </thead>
                    <tr>
                        <td class="col1" id="user_name"></td>
                        <td class="col2" id="minions"></td>
                        <td class="col3" id="stalt_type"></td>
                        <td class="col4" id="stalt_input"></td>
                        <td class="col5" id="jobs_id"></td>
                        <td class="col6" id="log_time"></td>
                    </tr>
                    <thead>
                        <td colspan="6">返回数据</td>
                    </thead>
                    <tr>
                        <td colspan="6" id="api_return"></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(".pagei").change(function(){
        var index=$(this).children('option:selected').val();
        window.location.href="{% url 'saltstack:logs' %}?page=" + index;
    });
    $("#lookItem").on('show.bs.modal',function(event){
        var button = $(event.relatedTarget);
        var id = button.data("id");

        var urls = "{% url 'saltstack:getlog' %}";
        postdata = {id:id};
        var jsonstr = $.ajax({
			url : urls,
			type : "POST",
			data : postdata,
			async : false,
			cache : false
		});
		var jsonobj = eval('(' + jsonstr.responseText + ')');
		if(jsonobj.status==0){
		    alert(jsonobj.message);
		}else{
            $(this).find('#user_name').html(jsonobj.data.log.user_name);
            $(this).find('#minions').html(jsonobj.data.log.minions);
            $(this).find('#jobs_id').html(jsonobj.data.log.jobs_id);
            $(this).find('#stalt_type').html(jsonobj.data.log.stalt_type);
            $(this).find('#stalt_input').html(jsonobj.data.log.stalt_input);
            $(this).find('#api_return').html(jsonobj.data.log.api_return);
            $(this).find('#log_time').html(jsonobj.data.log.log_time);
        }
    });
</script>
{% endblock %}

